<!--
 * @Descripttion:
 * @version:
 * @Author: cxguo
 * @Date: 2020-08-17 16:49:50
 * @LastEditors: cxguo
 * @LastEditTime: 2020-11-12 15:33:14
-->
<template>
  <div>
    <vxe-grid
      ref="table"
      class="grid"
      border
      resizable
      :loading="tableLoading.table"
      :columns="columnsData"
      :data="data"
    />
  </div>
</template>

<script>
import { oftenuse } from '@/libs/mixins'

export default {
  mixins: [oftenuse],
  props: {
    data: {
      type: Array,
      default: () => { return [] }
    }
  },
  data() {
    return {
      columnsData: [
        { field: 'oper', title: '操作', width: 100,
          slots: {
            default: ({ row }) => {
              const { isLock } = row
              const value = isLock === '1' ? '解锁' : '锁定'
              const type = isLock === '1' ? 'danger' : 'primary'
              const data = {
                props: { type },
                on: {
                  click: () => {
                    this.handleStoreLock(row)
                  }
                }
              }
              return [<el-button {...data}>{value}</el-button>]
            }
          }
        }
      ]
    }
  },
  created() {
    this.initData()
  },
  methods: {
    initData() {

    },
    lockStock() {
    },
    setLockData({ id, isLock }) {
      const data = this.data.find(item => { return item.id === id })
      this.$set(data, 'isLock', isLock)
    },
    unlockStock() {
    },
    handleStoreLock(row) {
      const { isLock, id } = row
      if (isLock === '1') {
        this.unlockStock(id)
      } else {
        this.lockStock(id)
      }
    }
  }
}
</script>

<style>

</style>
